<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    <!-- 1.get -->
    <button id="btnGET1">get不带参数的请求</button>
    <button id="benGET2">get带函数的请求</button>
    <script>
        $(function(){
            $('#btmGET1').on('click',function(){
                $.get('http://www.baidu.com',function(res){
                    console.log(res)
                })
            })
        })
    </script>
    <script>
        $(function(){
             $('#btmGET2').on('click',function(){
                 $.get('http://www.baidu.com',{id:1},function(res){
                  console.log(res)
                })
             })
        })
    </script>
    <!-- 2.post -->
    <button id="brnPOST">post请求</button>
    <script>
         $(function(){
             $('#btmPOST').on('click',function(){
                 $.get('http://www.baidu.com',{book:'水浒传',author:'施耐庵'},function(res){
                  console.log(res)
                })
             })
        })
    </script>
    <!-- 3.ajax -->
    <button id="AJAXGET">ajax中get请求</button> 
    <button id="AJAXPOST">ajax中post请求</button>
    <script>
        $(function(){
            $('#btmGET').on('click',function(){
                $.ajax({
                    type:'get',
                    ur1:'http://www.baidu.com',
                    data:{
                        id:1
                    },
                    success:function(res){
                        console.log(res)
                    }
                })
            })
        })
    </script>
    <script>
        $(function(){
            $('#btmPOST').on('click',function(){
                $.ajax({
                    type:'post',
                    ur1:'http://www.baidu.com',
                    data:{
                        book:'史记',
                        author:'司马迁'
                    },
                    success:function(res){
                        console.log(res)
                    }
                })
            })
        })
    </script>
</body>
</html>